﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MerchantRegistration.aspx.cs"
    EnableEventValidation="false" Inherits="MerchantRegistration" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <%--from form's button design --%>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="css/design.css" rel="stylesheet" type="text/css" />
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" />
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <link href="css/style-responsive.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="css/style-metro.css" />
    <script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>
    <%--<script src="js/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script>--%>
    <style type="text/css">
        
        .page-header-fixed .page-container
        {
            margin-top: 0px !important;
        }
    </style>
</head>
<body class="page-header-fixed " style="background: url('img/registration1_bg.jpg') #8AC0A9;">
    <form id="form1" runat="server" class="horizontal-form">
    <asp:ScriptManager runat="server" ID="sm1">
    </asp:ScriptManager>
    <div class="page-container">
        <div class="container_main">
            <div class="row-fluid">
                <div class="span8 offset2 mt">
                    <div class="mt centered">
                        <img src="img/logo.png" alt="" />
                    </div>
                    <div class="inner_dark white_color">
                        <div class="pd10" style="font-family: Verdana;">
                            <h3 class="registrationHeading">
                                Registration</h3>
                            <div id="divMessage" runat="server" class="generalMessage">
                            </div>
                            <div class="offset1">
                                <%--    <h3>
                                Registration</h3>--%>
                                <div class="row-fluid">
                                    <div class="span6 ">
                                        <div class="control-group" id="divFirstName">
                                            <label class="control-label" for="firstName">
                                                Contact Name</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" TabIndex="1" ID="txtFirstName" placeholder="Contact Name"
                                                    CssClass="m-wrap span9 firstName"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                    <div class="span6 ">
                                        <div class="control-group " id="divBusinessName">
                                            <label class="control-label" for="BusinesName">
                                                Business Name</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" ID="txtBusinessName" TabIndex="5" placeholder="Bussines Name "
                                                    CssClass="m-wrap span9 businessName"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                <!--/row-->
                                <div class="row-fluid">
                                    <div class="span6 ">
                                        <div class="control-group" id="divEmailId">
                                            <label class="control-label">
                                                Email ID</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" TabIndex="2" ID="txtEmailId" onblur="checkEmailIdAvialibility();"
                                                    onkeypress="return checkEmailIdAvialibility();" placeholder="Email ID" CssClass="m-wrap span9 emailId"></asp:TextBox>
                                                <div class="msg">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                    <div class="span6 ">
                                        <div class="control-group" id="divAddress">
                                            <label class="control-label">
                                                Address Line1</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" placeholder="Address Line1" ID="txtAddress1" TabIndex="6"
                                                    CssClass="m-wrap span9 address"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                <!--/row-->
                                <div class="row-fluid">
                                    <div class="span6 ">
                                        <div class="control-group" id="divMobileNo">
                                            <label class="control-label">
                                                Mobile Number</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" ID="txtMobileNo" TabIndex="3" placeholder="Mobile Number"
                                                    CssClass="m-wrap span9 mobileNo"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                    <div class="span6 ">
                                        <div class="control-group">
                                            <label class="control-label">
                                                Address Line2</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" ID="txtAddress2" placeholder="Address Line2" TabIndex="7"
                                                    CssClass="m-wrap span9"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                <!--/row-->
                                <%--<h3 class="form-section">
                                Address</h3>--%>
                                <div class="row-fluid">
                                    <div class="span6 ">
                                        <div class="control-group" id="divProductCategory">
                                            <label class="control-label">
                                                Category</label>
                                            <div class="controls">
                                                <asp:DropDownList runat="server" ID="drpCategory" TabIndex="4" DataTextField="Name"
                                                    DataValueField="Id" placeholder="Category" CssClass="m-wrap span9 productCategory">
                                                    <asp:ListItem Value="1" Text="Cellphones/Ipad/Accessories"></asp:ListItem>
                                                </asp:DropDownList>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                    <div class="span6 ">
                                        <div class="control-group" id="divState">
                                            <label class="control-label">
                                                State</label>
                                            <div class="controls">
                                                <asp:DropDownList runat="server" ID="drpState" onchange="BindCity();" TabIndex="8"
                                                    DataValueField="Id" DataTextField="Name" CssClass="m-wrap span9 state">
                                                </asp:DropDownList>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                <div class="row-fluid">
                                    <div class="span6 offset6">
                                        <div class="control-group" id="divCity">
                                            <label class="control-label">
                                                City</label>
                                            <div class="controls">
                                                <asp:DropDownList runat="server" ID="drpCity" DataTextField="Name" DataValueField="Id"
                                                    TabIndex="9" CssClass="m-wrap span9 city" onchange="getCityId();">
                                                </asp:DropDownList>
                                                <asp:TextBox ID="lblCityId" Style="display: none;" runat="server" class="drpCityId"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                <div class="row-fluid">
                                    <div class="span6 offset6">
                                        <div class="control-group" id="divPinCode">
                                            <label class="control-label">
                                                Postal Code</label>
                                            <div class="controls">
                                                <asp:TextBox runat="server" ID="txtPostalCode" placeholder="Postal Code" TabIndex="10"
                                                    CssClass="m-wrap span9 pinCode"></asp:TextBox>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row-fluid  registrationBtn">
                                    <div class="span6 " style="">
                                        <a href="" class="footerInfo underln txt_upper">ALREADY REGISTERD LOGIN NOW!</a>
                                        <div class="footerInfo2">
                                            For any queries, e-main us:suppor@gmail.com
                                        </div>
                                    </div>
                                    <!--/span-->
                                    <div class="span6">
                                        <asp:Button runat="server" ID="btnSave" OnClick="OnNext" Style="float: right;" Text="Next >>>"
                                            TabIndex="11" CssClass="btn blue frmValidation" OnClientClick="return frmValidation();" />
                                    </div>
                                </div>
                                <div class="">
                                    <%--<asp:Button runat="server" ID="btnCancel" Text="Cancel" CssClass="btn" PostBackUrl="~/State-List.aspx" />--%>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        function test() {
            alert('jay jalaram');
            alert($('.firstName').val());
            if ($('.firstName').val() == "") {
                $('.firstName').closest("#divFirstName").addClass("error")
                return false;
            }
        }
        $('.frmValidation').click(function () {

            var isError = "false";

            if ($('.msg').html() != "") {
                isError = "true";
            }

            if ($('.firstName').val() == "") {

                $('.firstName').closest("#divFirstName").addClass("error");
                isError = "true"
            }
            else {
                $('.firstName').closest("#divFirstName").removeClass("error");
            }

            //businessname
            if ($('.businessName').val() == "") {
                $('.businessName').closest("#divBusinessName").addClass("error");
                isError = "true"
            }
            else {
                $('.businessName').closest("#divBusinessName").removeClass("error");
            }
            if ($('.emailId').val() == "") {
                $('.emailId').closest("#divEmailId").addClass("error");
                isError = "true"
            }
            else {
                var sEmail = $('.emailId').val();

                var reg = /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/;
                if (reg.test(sEmail)) {
                    $('.emailId').closest("#divEmailId").removeClass("error");
                }
                else {
                    $('.emailId').closest("#divEmailId").addClass("error");
                    isError = "true"
                }


            }
            if ($('.address').val() == "") {
                $('.address').closest("#divAddress").addClass("error");
                isError = "true"
            }
            else {
                $('.address').closest("#divAddress").removeClass("error");
            }
            if ($('.mobileNo').val() == "") {
                $('.mobileNo').closest("#divMobileNo").addClass("error");
                isError = "true"
            }
            else {
                $('.mobileNo').closest("#divMobileNo").removeClass("error");
            }
            if ($('.productCategory').val() == "" || $('.productCategory').val() == "0") {
                $('.productCategory').closest("#divProductCategory").addClass("error");
                isError = "true"
            }
            else {
                $('.productCategory').closest("#divProductCategory").removeClass("error");
            }
            if ($('.state').val() == "" || $('.state').val() == "0") {
                $('.state').closest("#divState").addClass("error");
                isError = "true"
            }
            else {
                $('.state').closest("#divState").removeClass("error");
            }
            if ($('.city').val() == " " || $('.city').val() == "0") {
                $('.city').closest("#divCity").addClass("error");
                isError = "true"
            }
            else {
                $('.city').closest("#divCity").removeClass("error");
            }

            if ($('.pinCode').val() == "") {
                $('.pinCode').closest("#divPinCode").addClass("error");
                isError = "true"
            }
            else {
                $('.pinCode').closest("#divPinCode").removeClass("error");
            }
            if (isError == "true") {
                $(".generalMessage").html('<strong>Error!</strong> Please check your validation in red.');
                $(".generalMessage").addClass("alert alert-danger");
                return false;
            }
        });

    </script>
    <script type="text/javascript">
        function BindCity() {
            $('#drpCity').empty();
            // alert('jay jalaram');
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "./MerchantRegistration.aspx/LoadCity",
                data: "{stateId:'" + $('#<%= drpState.ClientID %>').val() + "'}",
                dataType: "json",
                success: function (Result) {
                    $("#drpCity").append($("<option></option>").val("0").html("Select"));
                    $.each(Result.d, function (key, value) {
                        $("#drpCity").append($("<option></option>").val(value.Id).html(value.Name));
                    });
                },
                error: function (Result) {
                    alert("Error");
                }
            });
        }
        function getCityId() {
            $(".drpCityId").val($("#drpCity").val());
        }

        function checkEmailIdAvialibility() {

            $.ajax({
                type: "POST",
                url: "./MerchantRegistration.aspx/checkEmailIdAvialibility",
                contentType: "application/json; charset=utf-8",
                data: "{EmailId:'" + $('#<%= txtEmailId.ClientID  %>').val() + "'}",
                dataType: "json",
                success: function (response) {
                    if (response.d == true) {
                        $('.msg').html("Email id is already exits..");
                        $('.msg').css("color", "#b94a48");
                        $('.emailId').closest('#divEmailId').addClass("error");
                    }
                    else {
                        $('.msg').html("");
                        $('msg').closest("#divEmailId").removeClass("error");
                    }
                },
                failure: function () {
                }
            });
        }
       
    </script>
    </form>
</body>
</html>
